﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script type="text/javascript" src="00.jquery-2.0.3.js"></script>
</head>
<body>
    <div data-title="div1"></div>
    <div data-title="div2"></div>
    <script type="text/javascript">
        $(function () {
            var body = document.body;
            //设置缓存的值
            $.data(body, "name", "zhangsan");
            $.data(body, {
                "age": 18,
                "color": "red"
            });

            //取得cache
            var cache = $.data(body)

            //取得指定的值
            $.data(body, "name");
            $.removeData(body, "name");

            //----------------------------------实例的缓存数据方法
            //综述:取值只会取得第一个实例的cache ,设定值是给所有的实例都设定

            //给每个div都生成缓存数据(有2个div就会有2个cache)
            $("div").data({
                "name": "zhangsan",
                "age": 18
            });
            //每个div的cache都缓存attr属性
            $("div").data("attr", "1");

            //取出第一个div对应的cache(对html5属性进行了特殊的处理)
            var data = $("div").data();

            //取出第一个div对应的attr的值
            data = $("div").data("attr");
        });
    </script>
</body>
</html>
